<template>
    <div class="step3_box">
        <!-- 引入头部导航组件 -->
        <Appnavigatebar title="注册第三步" :isshowright="false"></Appnavigatebar>
        <van-form @submit="submitFn">
            <van-field v-model="password" type="password" name="密码" label="密码" placeholder="密码必须为数字字母下划线6位"
                :rules="[{ pattern, message: '输入有误' }]" />
            <div style="margin: 16px;">
                <van-button round block type="info" native-type="submit">提交</van-button>
            </div>
        </van-form>
    </div>
</template>

<script>
import Appnavigatebar from '@/components/Appnavigatebar.vue';
// 引入接口
import { finishregisterApi } from '@/api/regist'
export default {
    data() {
        return {
            password: '',
            isdisabled: true,
            pattern: /\w{6}/,  // 密码验证规则
            tel: this.$route.params.tel
        }
    },
    components: {
        Appnavigatebar
    },
    methods: {
        submitFn(values) {
            // 点击完成
            console.log('submit', values);
            finishregisterApi({
                tel: this.tel,
                password: values['密码']
            }).then(res => {
                if (res.code == 200) {
                    this.$toast({
                        type: 'success',
                        message: '注册成功',
                        duration: 1000,
                        onClose: () => {
                            this.$router.push('/login')
                        }
                    })
                } else {
                    this.$toast({
                        type: 'fail',
                        message: res.message,
                        duration: 1000,
                    })
                }
            })
        }
    }
}
</script>
<style lang="less" scoped>
.step3_box {
    height: 100%;
    background: #f6f6f6;

}

.submit_box {
    width: 100%;
    display: flex;
    margin-top: 50px;
    justify-content: center;
}

.van-button--large {
    width: 80%;
    height: 40px;
}
</style>